<template>
	<view>
		<view class="head">
			<image src="../../static/images/arrow_left.png" mode="" @click="gggo"></image>
			<view class="">货品销售明细报表</view>
			<view class="f32" @click="godownload">导出历史</view>
		</view>
		<view class="box">温馨提示:每天可执行10次导出任务</view>
		<view class="time" style="margin-bottom: 0;">
			<view class="time-l">起始日期</view>
			<picker mode="date" :start="startDate" :end="endDate" @change="bindDateChange">
				<view class="uni-input">{{ fdate }}</view>
			</picker>
			<image src="../../static/images/arrow_right.png" mode=""></image>
		</view>
		<view class="time">
			<view class="time-l">截至日期</view>
			<picker mode="date" :start="startDate" :end="endDate" @change="bindDateChange02">
				<view class="uni-input">{{ enDate }}</view>
			</picker>
			<image src="../../static/images/arrow_right.png" mode=""></image>
		</view>
		<button type="primary" @click="dowLoad">开始导出数据</button>
	</view>
</template>

<script>
import uniPopup from '@/components/uni-popup/uni-popup.vue';
export default {
	components: { uniPopup },
	data() {
		const currentDate = this.getDate({
			format: true
		});
		return {
			fdate: currentDate,
			enDate: currentDate,
			log_id: '',
			scss:'',
			group:'',
		};
	},
onLoad(e) {
	
	if(e.item==1){
	this.scss='saleProductCount'
	this.group='customer'
	}else{
		this.scss=e.item
	}
},
	methods: {
		bindDateChange02(e) {
			this.enDate = e.target.value;
		},
		bindDateChange: function(e) {
			// console.log(e);
			this.fdate = e.target.value;
		},
		getDate(type) {
			const date = new Date();
			let year = date.getFullYear();
			let month = date.getMonth() + 1;
			let day = date.getDate();

			if (type === 'start') {
				year = year - 60;
			} else if (type === 'end') {
				year = year + 2;
			}
			month = month > 9 ? month : '0' + month;
			day = day > 9 ? day : '0' + day;
			return `${year}-${month}-${day}`;
		},
		dowLoad() {
			// console.log(this.fdate);
			// console.log(this.enDate);
			this.$ajax(`api/v1.export/${this.scss}`, {
				start_time: this.fdate,
				end_time: this.enDate,
				group:this.group
			})
				.then(res => {
					this.log_id = res.result.log_id;
					this.$ajax('api/v1.export/status', {
						log_id: this.log_id
					})
						.then(res => {
							this.$ajax('api/v1.export/download', {
								log_id: this.log_id
							})
								.then(res => {
									console.log(res);
								})
								.catch(res => {
									console.log(Error);
								});
						})
						.catch(res => {
							console.log(Error);
						});
				})
				.catch(res => {
					console.log(Error);
				});
		},
		godownload(){
			uni.navigateTo({
				url:'download'
			})
		},
		gggo(){
			uni.navigateTo({
				url:'educe'
			})
		}
	},
	computed: {
		startDate() {
			return this.getDate('start');
		},
		endDate() {
			return this.getDate('end');
		}
	},
	watch: {
		enDate(newTime, oldTime) {
			// console.log(newTime);
			if (newTime < this.fdate) {
				uni.showToast({
					title: '起始日期不能大于截至日期',
					duration: 2000,
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style lang="scss">
page {
	background-color: #f7f4f8;
}
.head {

	background-color: #249af6;
	color: #ffffff;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 60upx 30upx 30upx;
	justify-content: space-between;
	font-size: 36rpx;
	font-family: PingFang SC;
	font-weight: 500;

	image {
		width: 22rpx;
		height: 39rpx;
		
	}
}
.box {
	line-height: 88rpx;
	height: 88rpx;
	font-size: 28rpx;
	font-family: PingFang SC;
	font-weight: 500;
	padding-left: 32rpx;
	box-sizing: border-box;
}
.time {
	height: 109rpx;
	padding: 30rpx 40rpx;
	background: rgba(255, 255, 255, 1);
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
	margin-bottom: 101rpx;
	image {
		width: 18rpx;
		height: 33rpx;
	}
}
button {
	width: 80%;
	margin: 0 auto;
}
</style>
